<template>
  <div class="min-h-screen bg-background-950 flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
    <div class="max-w-md w-full space-y-8">
      <!-- 网站标题和副标题 -->
      <div class="text-center">
        <h1 class="text-3xl font-bold text-text-primary mb-2">虚构影评</h1>
        <p class="text-text-muted">{{ subtitle }}</p>
      </div>
      
      <!-- 表单容器 -->
      <div class="glass-effect py-8 px-6 shadow-2xl rounded-2xl border border-background-700/50">
        <!-- 页面标题 -->
        <div class="text-center mb-6">
          <h2 class="text-2xl font-extrabold text-text-primary">
            {{ title }}
          </h2>
        </div>
        
        <slot />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
interface Props {
  title: string
  subtitle?: string
}

withDefaults(defineProps<Props>(), {
  subtitle: '加入我们，探索平行宇宙中的电影艺术'
})
</script> 